<style scoped>
.selec{ width: 20%; margin-left: 70%}
</style>
<template>
  <div>
    <mt-header fixed title="支付方式"></mt-header>
    <mt-cell title="趣美钱宝"  style="margin-top:40px"  @click.native="change('qumei')">
    <img class="selec" src="../assets/img/select.png" v-show="payway[0].way">
    </mt-cell>
    <mt-cell title="微信支付" @click.native="change('weixin')">
    <img class="selec" src="../assets/img/select.png" v-show="payway[1].way">
    </mt-cell>
    <mt-cell title="支付宝" @click.native="change('zhifubao')">
    <img class="selec" src="../assets/img/select.png" v-show="payway[2].way">
    </mt-cell>
  </div>
</template>
<script>
import { Header,Cell} from 'mint-ui';
export default {
    data() {
        return {
          payway:[
            {
              "name":"qumei",
              "way":true
            },
            {
              "name":"weixin",
              "way":false
            } ,
            {
              "name":"zhifubao",
              "way":false
            }  
          ]
       }
    },
    components: {
     [Header.name]: Header,
     [Cell.name]: Cell
    },
    created:function(){
        document.title="支付方式"
    },
    methods :{
     change(way){
      let pay_way
      for(let i=0;i<this.payway.length;i++){
        if(this.payway[i].name==way){
          this.payway[i].way =true
          pay_way = this.payway[i].name
          window.location.href = "/counter?payway="+pay_way
        }else{
          this.payway[i].way =false
        }
      }
     }
    },
    
  }
</script>
